<template>
	<view class="content" :style="'background:#f7f7f7;'">
		<block>
			<view class="flex-center" :id="'item-' + index">
				<view class="luttery-top-info" :style="'background:#FFFFFF;'">
					<image class="luttery-info-image" :src="luttery_info.cover" mode=""></image>
					<view class="luttery-text">
						<block v-for="(item, index) in goods_list" :key="index">
							<text class="text1 font30" :style="'color:#111111;'">{{item.sort}}等奖：{{item.name}}</text>
						</block>
						<text class="text3 font28" :style="'color:#AEAEAE;'">{{luttery_info.open_time}}自动开奖</text>
					</view>
				</view>
				<view class="luttery-info-title" :style="'background:#FFFFFF;'" v-if="luttery_info.name !=''">
					<view class="title-item1">
						<image src="../../../static/lottery-info-icon-title.png" mode=""></image>
						<text class="font30" :style="'color:#111111;'">{{luttery_info.name}}</text>
					</view>
					<view class="title-item2" :style="'background:#3786ED;'">
						<image src="../../../static/join-lottery.png" mode=""></image>
						<text class="font24" :style="'color:#FFFFFF;'">去了解</text>
					</view>
				</view>
				<view class="luttery-start-info-rule" :style="'background:#FFFFFF;'">
					<view class="rule-top-tab" :style="'border-bottom: 2upx solid #ebebeb;'">
						<block v-for="(item, index) in luttery_rule" :key="index">
							<view class="item-left" @click="changeLutteryRule(item.id)">
								<text :style="{color:(item.id == luttery_rule_id?'#E9564F;':'#000000;')}">{{item.name}}</text>
								<view v-if="item.id == luttery_rule_id" class="bottom-line" :style="'background:#E9564F;'"></view>
							</view>
						</block>
					</view>
					<text class="rule-rich-text" v-if="luttery_rule_id == 1" :style="'color:#111111;'">{{luttery_info.desc}}</text>
					<view class="rule-rich-text" v-if="luttery_rule_id == 2">
						<block v-for="(item, index) in luttery_info.images" :key="index">
							<image style="width: 100%;" :src="item" mode="widthFix"></image>
						</block>
						<text class="rule-rich-text" :style="'color:#111111;'">{{luttery_info.content}}</text>
					</view>
				</view>
				<block>
					<view class="start-luttery-click">
						<view class="start-btn" @click="startLutteryBefore" :style="click_satrt_luttery?'left:-220rpx':''">
							<image class="start-image-bg" src="../../../static/lutterystartbtnbgimg.png" mode=""></image>
							<text class="start-text" :style="'color:#FFFFFF;'">点击抽奖</text>
							<view class="start-tip" v-if="!click_satrt_luttery">
								<image class="left-image" src="../../../static/clickstartluttery.png" mode=""></image>
								<view class="tip-text">
									<image class="tip-text-bgimg" src="../../../static/clickstarttitlebgimg.png" mode=""></image>
									<text class="font30 tip-text-text" :style="'color:#111111'">点击参与抽奖</text>
								</view>
							</view>
						</view>
						<block v-if="luttery_info.has_join == 1">
							<view class="start-btn" v-if="click_satrt_luttery && luttery_info.open_type!=3 && is_lookadVideo != 1" @click="startJoinFriend">
								<image class="start-image-bg" src="../../../static/lutterystartbtnbgimg.png" mode=""></image>
								<text class="start-text" :style="'color:#FFFFFF;'">继续助力</text>
							</view>
							<view class="start-line" v-if="click_satrt_luttery" :style="'border:2rpx dashed #D3D3D3'"></view>
							<view class="look-video-top-tip" v-if="is_lookadVideo == 1">
								<image src="../../../static/lookadvideotopbgimgtip.png" mode=""></image>
								<text class="font30 top-tip-text" :style="'color:#111111;'">观看视频额外得机会券</text>
							</view>
							<ucircleprogress v-if="is_lookadVideo == 1" :active-color="'#F8F400'" :inactive-color="'#F96468'" :width="260" :percent="width_luttery">
								<view class="look-ad-video" @click="beforelookAdVideo(2)" :style="'background: linear-gradient(-4deg, rgba(251, 98, 102, 0.99), rgba(255, 128, 132, 0.99));'">
									<view class="font48 fontw" :style="'color:#FFFFFF;'">观看视频</view>
									<text v-if="see_adv_count_down >0" class='font30 text-time' :style="'color:#FFFFFF;'">{{see_adv_count_down}}s</text>
								</view>
							</ucircleprogress>
						</block>
					</view>
					<block v-if="click_satrt_luttery && luttery_info.open_type!=3">
						<view class="font24 friend-text" :style="'color:#7c7c7c;'">
							邀请好友助力提升中奖概率
						</view>
						<view class="continue-help" >
							<view class="item-1" @click="$refs.getCouponList.open()" style="margin-right: 30rpx;" :style="'color:#7c7c7c'">
								<text>已获得机会券 <text :style="'color:#E9564F;'">{{luttery_info.all_num}}</text></text>
							</view>
							<view class="item-1" :style="'color:#7c7c7c'" @click="$refs.helpRulePopup.open()">
								<text>助力规则</text>
							</view>
						</view>
					</block>
				</block>
				<view class="join-number" @click="goToJoinUser">
					<text :style="'color:#111111;'">已有{{luttery_info.join_num}}人参与抽奖，<text :style="'color:#E9564F'">查看全部</text></text>
					<image class="red-next-image" src="../../../static/red_next.png" mode=""></image>
				</view>
				<view class="join-avatar-user">
					<block v-for="(item, index) in join_list" :key="index">
						<image class="join-avatar" :src="item.avatar" mode=""></image>
					</block>
				</view>
				<view class="ad-image ">
					<ad :unit-id="luttery_config.wx_prizedraw_banner_adv_key"></ad>
				</view>
				<view class="share-btn-index">
					<button class="share-btn" :style="'background:#FFFFFF;'" type="default" open-type="share">
						<image class="share-icon" src="../../../static/share-icon.png" mode=""></image>
						<text class="font30 fontw500">分享给好友</text>
					</button>
				</view>
				<view class="" style="height: 200rpx;"></view>
				<view class="bottom-btn" :style="'background:#FFFFFF;'" v-if="luttery_info.is_lock == 0">
					<view class="btn" :style="{border:'2rpx solid #E9564F'}" @click="goToSendLuttery">
						<text :style="'color:#E9564F;'">发布抽奖</text>
					</view>
					<view class="btn" :style="{border:'2rpx solid #E9564F'}"  @click="goTopay">
						<text :style="'color:#E9564F;'">去支付</text>
					</view>
					<view class="btn" :style="{border:'2rpx solid #E9564F'}" @click="goToEditLuttery(1)">
						<text :style="'color:#E9564F;'">编辑抽奖</text>
					</view>
					<view class="btn" :style="{border:'2rpx solid #E9564F'}" @click="goToDeleteLuttery">
						<text :style="'color:#E9564F;'">删除抽奖</text>
					</view>
				</view>
			</view>
		</block>
		
		<uni-popup ref="noticePopup" type="center" :maskClick="false">
			<view class="publicpopup" :style="'background:#FFFFFF;'">
				<image class="closeAssistant" @click="$refs.noticePopup.close()" src="../../../static/close-popup2.png" mode=""></image>
				<view class="notice-index">
					<text class="new-user-top-text font36 fontw" :style="'color:#111111;'">
						开启中奖通知，不错过大奖！~
					</text>
					<image class="notice-image" src="../../../static/showjiaonang.png" mode=""></image>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="openNoticePopup" type="center" :maskClick="false">
			<view class="publicpopup" :style="'background:#FFFFFF;'">
				<image class="closeAssistant" @click="$refs.openNoticePopup.close()" src="../../../static/close-popup2.png" mode=""></image>
				<view class="notice-index">
					<text class="new-user-top-text1 font36 fontw" :style="'color:#111111;'">
						温馨提示
					</text>
					<image class="notice-image1" src="../../../static/notice2.png" mode=""></image>
					<text class="font30 text-center notiec-text" :style="'color:#7c7c7c;'">
						建议开启【接受订阅消息】
						允许通知开奖结果，不错过中奖消息。
					</text>
				</view>
				<view class="public-btn" @click="notiecOpen">
					<image class="medium-btn-css" src="../../../static/medium-btn.png" mode=""></image>
					<text class="btn-text font34" :style="'color:#FFFFFF;'">去开启开奖通知</text>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="noticeSuccessPopup" type="center" :maskClick="false">
			<view class="publicpopup" style="background: rgba(0,0,0,0);">
				<image class="closeAssistant close-btn" @click="$refs.noticeSuccessPopup.close()" src="../../../static/wite-close.png" mode=""></image>
				<image class="bgimgpublic bg-height" style="z-index: 0;" src="../../../static/join-success-bgimg.png" mode=""></image>
				<view class="notice-index">
					<view class="success-notice-top" :style="'color:#FFFFFF'">
						<image class="success-icon" src="../../../static/join-success-icon.png" mode=""></image>
						<text>参与成功</text>
					</view>
					<text class="font28 text-center notiec-text" :style="'color:#ffffff;'">
						开奖时间为{{luttery_info.open_time}}
						请留意开奖通知，不要错过哦~
					</text>
					<view class="notice-btn-list">
						<button class="btn-item1 btn-item-margin" open-type="share" type="default">
							<image class="btn-item1-css" src="../../../static/small-btn.png" mode=""></image>
							<text class="btn-text font34" :style="'color:#FFFFFF;'">分享给好友</text>
						</button>
						<view class="btn-item1" :style="'border: 2rpx solid #E9564F;'" @click="$refs.noticeSuccessPopup.close()">
							<text class="btn-text font34" :style="'color:#E9564F;'">好的</text>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="helpRulePopup" type="center" :maskClick="false">
			<view class="publicpopup">
				<image class="popuptopimge" src="../../../static/helprule.png" mode=""></image>
				<image class="closeAssistant" @click="$refs.helpRulePopup.close()" src="../../../static/popuplutteryAssistantClose.png" mode=""></image>
				<image class="bgimgpublic" style="z-index: 0;" src="../../../static/luttery-start-bgimg.png" mode="widthFix"></image>
				<view class="help-rule-popup">
					<text class="top-tip-title font36 fontw" :style="'color:#E9564F;'">助力规则说明</text>
					<rich-text style="line-height: 48rpx;width: 100%;" :nodes="luttery_config.prizedraw_share_rule"></rich-text>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="getCouponList" type="center" :maskClick="false">
			<view class="publicpopup">
				<image class="popuptopimge" src="../../../static/luck-coupon.png" mode=""></image>
				<image class="closeAssistant" @click="$refs.getCouponList.close()" src="../../../static/popuplutteryAssistantClose.png" mode=""></image>
				<image class="bgimgpublic" style="z-index: 0;" src="../../../static/luttery-start-bgimg.png" mode="widthFix"></image>
				<view class="luck-list-popup">
					<text class="top-tip-title1 font36 fontw" :style="'color:#E9564F;'">已获得{{luttery_info.all_num}}张机会券</text>
					<scroll-view scroll-y="true" style="height: 310rpx;width: 100%;">
						<block v-for="(item, index) in record" :key="index">
							<view class="luck-list-item font28" :style="'color:#111111;background:#F5F5F5;'">
								<text>{{item.type_name}}</text>
								<text>+{{item.num}}</text>
							</view>
						</block>
					</scroll-view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="joinFriendPopup" type="bottom" :maskClick="false">
			<view class="publicbottompopup" :style="'background:#FFFFFF;'">
				<image class="close-popup" @click="$refs.joinFriendPopup.close()" src="../../../static/close-popup2.png" mode=""></image>
				<view class="friend-task-index">
					<view class="top-tip" :style="'background:#ebebeb;'">
						<text class="font34" :style="'color:#111111;'">助力得机会券，增加中奖机会</text>
					</view>
					<view class="task-top-center">
						<text class="font30 text1" :style="'color:#111111;'">好友助力</text>
						<text class="font28 text2" :style="'color:#AEAEAE;'">每邀请一名好友助力+1机会券</text>
					</view>
					<view class="share-list">
						<button class="item-btn-1 left-btn" :style="'background:#FEECED;'" open-type="share" type="default">
							<image class="wx-icon-share" src="../../../static/wx_icon_1.png" mode=""></image>
							<text class="font30" :style="'color:#E5964F;'">发送给好友群</text>
						</button>
						<view class="item-btn-1" :style="'background:#FEECED;'" @click="goToPoster">
							<image class="down-load" src="../../../static/down_load.png" mode=""></image>
							<text class="font30" :style="'color:#E5964F;'">保存海报分享</text>
						</view>
					</view>
					<view class="task-list">
						<view class="task-item">
							<text class="text-name font30" :style="'color:#111111;'">5积分兑换</text>
							<text class="text-info font28" :style="'color:#AEAEAE;'">机会券+1，仅限3次</text>
							<view class="item-btn font30" :style="'background:#FEECED;'">
								<text :style="'color:#E9564F;'">兑换</text>
							</view>
							<view v-if="false" class="item-btn font30" :style="'background:#FEECED;'">
								<image class="lookad-icon" src="../../../static/lookadvideo_icon.png" mode=""></image>
								<text :style="'color:#E9564F;'">观看视频</text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="keyStartPopup" type="center" :maskClick="false">
			<view class="publicpopup">
				<image class="closeAssistant" @click="closeStartKey" src="../../../static/popuplutteryAssistantClose.png" mode=""></image>
				<image class="bgimgpublic" style="z-index: 0;" src="../../../static/luttery-start-bgimg.png" mode="widthFix"></image>
				<view class="start-luttery-index">
					<text class="start-top-text font36 fontw" :style="'color:#E9564F;'">联系活动发起人获取口令</text>
					<view class="get-opportunity">
						<text class="font30" :style="'color:#7c7c7c;'">去获取</text>
						<image class="" src="../../../static/neck-bload.png" mode=""></image>
					</view>
					<input class="input-key" :style="'color:#111111;background:#f5f5f5;'" placeholder="请输入口令" :placeholder-style="'color:#111111;'" type="text" :value="start_key" @input="inputStartKey" />
					<view class="notice-btn-list">
						<view class="btn-item1 btn-item-margin" @click="startKeyBefore">
							<image class="btn-item1-css" src="../../../static/small-btn.png" mode=""></image>
							<text class="btn-text font34" :style="'color:#FFFFFF;'">参与抽奖</text>
						</view>
						<view class="btn-item1" :style="'border: 2rpx solid #E9564F;'" @click="closeStartKey">
							<text class="btn-text font34" :style="'color:#E9564F;'">取消</text>
						</view>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="keyFileStartPopup" type="center" :maskClick="false">
			<view class="publicpopup">
				<image class="closeAssistant" @click="$refs.keyFileStartPopup.close()" src="../../../static/popuplutteryAssistantClose.png" mode=""></image>
				<image class="bgimgpublic" style="z-index: 0;" src="../../../static/luttery-start-bgimg.png" mode="widthFix"></image>
				<view class="start-luttery-index">
					<text class="start-top-text font36 fontw" :style="'color:#E9564F;'">口令错误</text>
					<view class="get-opportunity-file">
						<text class="font30" :style="'color:#7c7c7c;'">联系发起人获取正确口令哦~</text>
					</view>
					<image class="file-key-image-css" src="../../../static/start-key-file.png" mode=""></image>
					<view class="public-btn" @click="againInput">
						<image class="medium-btn-css" src="../../../static/medium-btn.png" mode=""></image>
						<text class="btn-text font34" :style="'color:#FFFFFF;'">重新输入</text>
					</view>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="tipNoticePopup" type="center" :maskClick="false">
			<view class="publicpopup" :style="'background:#FFFFFF;'">
				<image class="closeAssistant" @click="$refs.tipNoticePopup.close()" src="../../../static/popuplutteryAssistantClose.png" mode=""></image>
				<text class="file-luttery font30" :style="'color:#111111;'" v-if="luttery_info.condition_sex == 1">
					该活动仅限女生参与哦，
					再去看看其他活动吧！
				</text>
				<text class="file-luttery font30" :style="'color:#111111;'" v-if="luttery_info.condition_sex == 2">
					该活动仅限男生参与哦，
					再去看看其他活动吧！
				</text>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	import ucircleprogress from '../../../uview-ui/components/u-circle-progress/u-circle-progress.vue'
	var util = require('@/js/util.js')
	export default {
		components:{
			ucircleprogress
		},
		data() {
			return {
				percent:10,
				click_satrt_luttery:false,
				luttery_rule_text:`<p>本次奖品由【潘达抽奖】赞助提供
									【潘达抽奖】是一个专注爆款抽奖活动的小程序
									【用户福利】品牌方联合活动方送福利，每天都会上线几款品牌商品折扣品牌方联合活动方送福利，每天都会上线几款品牌商品折扣品牌方联合活动方送福利，每天都会上线几款品牌商品折扣品牌方联合活动方送福利！</p>`,
				start_key:'',
				help_rule_text:`<p style="line-height:48rpx">1 .参与抽奖即获得1张机会券；可通过邀请好友
				助力等方式提高中奖概率。
				2 .到达开奖状态时，系统自动从全部已产生的机
				会券中随机抽取中奖的机会券，每张券的机会均
				等。
				3 .中奖概率计算：（已获得机会券的数量+当前
				抽奖全部机会券）X100%。获得的机会券越多，
				中奖概率越高。</p>`,
				luttery_rule_id:1,
				luttery_rule:[
					{
						id:1,
						name:'抽奖说明'
					},
					{
						id:2,
						name:'图文介绍'
					}
				],
				show_next_bottom_tip:false,
				swiper_index:[{id:0},{id:0},{id:0}],
				double_bottom_scroll:0,
				autoplay:false,
				thisswipreindex:0,
				pre_live_info:0,
				next_live_info:0,
				luttery_id:0,
				luttery_info:[],
				goods_list:[],
				join_list:[],
				luttery_config:'',
				record:[],
				next_id:0,
				pre_id:0,
				drawResult:null,
				openVideo:null,
				is_lookadVideo:0,
				lookVideo_interval:'',
				width_luttery:0,
				luttery_time:0,
				see_adv_count_down:0,
				show_no:0
			};
		},
		onShow() {
			this.luttery_config = uni.getStorageSync("luttery_config")
			this.getLutteryInfo()
			console.log(this.luttery_config)
		},
		onShareAppMessage() { // 分享 buttom share
			return {
				title: '抽奖助手',
				path: '/pages/index/index?parent_id='+uni.getStorageSync('member_id')+'&prizedraw_id='+this.luttery_id
			}
		},
		onLoad(e) {
			this.$refs.openNoticePopup.open()
			this.luttery_id = e.id
			console.log(this.luttery_id)
		},
		methods:{
			goTopay(){
				let _self = this
				if(_self.luttery_info.has_pay == 0){
					uni.request({
						url: util.getUrl("prizedraw/pay"),
						header: {
							'content-type': 'application/x-www-form-urlencoded',
							'Authori-zation':uni.getStorageSync("token")
						},
						data:{
							prizedraw_id:_self.luttery_id
						},
						method: 'POST',
						success: res => {
							if(res.data.code == 1){
								uni.requestPayment({
									provider:'wxpay',
									timeStamp:res.data.data.timeStamp,
									nonceStr:res.data.data.nonceStr,
									package:res.data.data.package,
									signType:res.data.data.signType,
									paySign:res.data.data.sign,
									success: (res) => {
										uni.showToast({
											title:'支付成功！',
											icon:'success'
										}) 
										_self.getLutteryInfo()
									},
									fail: (e) => {
										console.log(e)
										uni.showToast({
											title:'支付取消',
											icon:'none'
										})
									}
								}) 
							}else{
								uni.showToast({
									title:res.data.msg,
									icon:'none'
								})
							}
						},
					});
				}
			},
			goToDeleteLuttery(){
				let _self = this
				uni.request({
					url: util.getUrl("prizedraw/del"),
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation':uni.getStorageSync("token")
					},
					data:{
						id:_self.luttery_id,
					},
					method: 'POST',
					success: res => {
						if(res.data.code == 1){
							uni.showToast({
								title:res.data.msg,
								icon:'success'
							})
							setTimeout(()=>{
								uni.navigateBack({
									
								})
							},2500)
						}else{
							uni.showToast({
								title:res.data.msg,
								icon:'none'
							})
							if(res.data.code == 500){
								uni.navigateTo({
									url:'../../../pages/login/login'
								})
							}
						}
					},
				});
			},
			goToEditLuttery(type){
				uni.navigateTo({
					url:'editLuttery?id='+this.luttery_id+'&type='+this.luttery_info.type+'&editType='+type
				})
			},
			goToSendLuttery(){
				let _self = this
				uni.request({
					url: util.getUrl("prizedraw/change"),
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation':uni.getStorageSync("token")
					},
					data:{
						id:_self.luttery_id,
						status:1
					},
					method: 'POST',
					success: res => {
						if(res.data.code == 1){
							uni.showToast({
								title:"发布成功",
								icon:'success'
							})
							_self.getLutteryInfo()
						}else{
							uni.showToast({
								title:res.data.msg,
								icon:'none'
							})
							if(res.data.code == 500){
								uni.navigateTo({
									url:'../../../pages/login/login'
								})
							}
						}
					},
				});
			},
			getLutteryInfo(){
				let _self = this
				clearInterval(_self.lookVideo_interval)
				uni.request({
					url: util.getUrl("prizedraw/info"),
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation':uni.getStorageSync("token")
					},
					data:{
						prizedraw_id:_self.luttery_id
					},
					method: 'POST',
					success: res => {
						if(res.data.code == 1){
							_self.luttery_info = res.data.data.info
							_self.goods_list = res.data.data.goods
							_self.join_list = res.data.data.join_list
							_self.drawResult = res.data.data.drawResult
							_self.record = res.data.data.record
							_self.next_id = res.data.data.next_id
							_self.pre_id = res.data.data.pre_id
							_self.see_adv_count_down = res.data.data.see_adv_count_down
							console.log("_self.luttery_config.prizedraw_see_adv_reward",_self.luttery_config.prizedraw_see_adv_reward)
							_self.is_lookadVideo = res.data.data.info.see_adv_change_num < _self.luttery_config.prizedraw_see_adv_reward ? 1:0
							console.log("_self.is_lookadVideo",_self.is_lookadVideo)
							if(_self.luttery_info.has_join == 1){
								_self.click_satrt_luttery = true
							}else{
								_self.click_satrt_luttery = false
							}
							if(_self.is_lookadVideo == 1){
								if(_self.see_adv_count_down>0){
									_self.startVideoTime()
								}
							}
						}else{
							if(res.data.code == 500){
								uni.navigateTo({
									url:'../../../pages/login/login'
								})
							}
						}
					},
				});
			},
			startVideoTime(){
				let _self = this
				_self.lookVideo_interval = setInterval(()=>{
					_self.see_adv_count_down --
					_self.width_luttery = 100 - (_self.see_adv_count_down/ _self.luttery_config.prizedraw_see_adv_interval)*10000/100
					console.log(_self.width_luttery)
					if(_self.see_adv_count_down<=0){
						clearInterval(_self.lookVideo_interval)
					}
				},1000)
			},
			changeSwiper(e){
				var current = e.detail.current;
				console.log(e,"changeSwiper")
				this.show_next_bottom_tip = false
				if (this.thisswipreindex == 0) {
					if (current == 1) {
						// 下滑 pre_id
						this.luttery_id = this.pre_id;
					} else if (current == 2) {
						// 上滑
						this.luttery_id = this.next_id;
					}
				} else if (this.thisswipreindex == 1) {
					if (current == 2) {
						// 下滑
						this.luttery_id = this.pre_id;
					} else if (current == 0) {
						// 上滑
						this.luttery_id = this.next_id;
					}
				} else if (this.thisswipreindex == 2) {
					if (current == 0) {
						// 下滑
						this.luttery_id = this.pre_id;
					} else if (current == 1) {
						// 上滑
						this.luttery_id = this.next_id;
					}
				}
				this.thisswipreindex = e.detail.current;
				console.log(this.luttery_id,"this.luttery_id")
				if(this.luttery_id != null){
					this.getLutteryInfo()
				}else{
					uni.showToast({
						title:'暂无更多活动',
						icon:'none'
					})
				}
			},
			scrollFunction(e){
				if(e.detail.deltaY > 0){
					this.show_next_bottom_tip = false
					this.autoplay = false
				}
			},
			bottomScroll(e){
				this.double_bottom_scroll ++
				this.show_next_bottom_tip = true
				console.log(this.double_bottom_scroll,"this.double_bottom_scroll")
				if(this.double_bottom_scroll >= 2){
					console.log(this.swiper_index,"this.swiper_index")
				}
				console.log("bottomScroll",e)
			},
			changeLutteryRule(id){
				this.luttery_rule_id = id
			},
			goToPoster(){
				this.$refs.joinFriendPopup.close()
				uni.navigateTo({
					url:'posterInfo'
				})
			},
			startJoinFriend(){
				this.$refs.joinFriendPopup.open()
			},
			startLutteryBefore(){
				let _self = this
				_self.notiecOpen()
				if(_self.luttery_info.condition_token !=""){
					_self.$refs.keyStartPopup.open()
				}else if(_self.luttery_config.prizedraw_condition == 1){
					_self.lookAdVideo(1)
				}else{
					_self.startLuttery()
				}
			},
			startKeyBefore(){
				if(this.luttery_info.condition_token == this.start_key){
					if(this.luttery_config.prizedraw_condition == 1){
						this.lookAdVideo(1)
					}else{
						this.startLuttery()
					}
				}else{
					this.$refs.keyStartPopup.close()
					this.$refs.keyFileStartPopup.open()
				}
			},
			startLuttery(){
				let _self = this
				uni.request({
					url: util.getUrl("prizedraw/join"),
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation':uni.getStorageSync("token")
					},
					data:{
						prizedraw_id:_self.luttery_id,
						share_member:uni.getStorageSync("parent_id"),
						prizedraw_token:_self.start_key
					},
					method: 'POST',
					success: res => {
						if(res.data.code == 1){
							_self.$refs.noticeSuccessPopup.open()
							_self.closeStartKey()
							_self.getLutteryInfo()
						}else{
							_self.$refs.tipNoticePopup.open()
							if(res.data.code == 500){
								uni.navigateTo({
									url:'../../../pages/login/login'
								})
							}
						}
					},
				});
			},
			startJoinLuttery(){
				if(this.start_key == ''){
					this.$refs.keyStartPopup.close()
					this.$refs.keyFileStartPopup.open()
				}else{
					this.$refs.keyStartPopup.close()
				}
			},
			beforelookAdVideo(type){
				if(this.see_adv_count_down >0){
					uni.showToast({
						title:'冷却中...',
						icon:'none'
					})
				}else{
					this.lookAdVideo(2)
				}
			},
			lookAdVideo(type){
				let _self = this
				if(_self.openVideo == null){
					// #ifdef MP-WEIXIN
					_self.openVideo = uni.createRewardedVideoAd({
						adUnitId:_self.luttery_config.wx_prizedraw_adv_key,
					})
					//#endif
					//#ifdef MP-QQ
					_self.openVideo = uni.createRewardedVideoAd({
						adUnitId:_self.luttery_config.qq_prizedraw_adv_key,
					})
					//#endif
					_self.openVideo.load((resLoad)=>{
						console.log("adload",resLoad)
					})
					_self.openVideo.onError(function(eError){
						console.log("eError",eError)
					})
					_self.openVideo.onClose((res)=>{
						console.log(type,"type")
						if(res && res.isEnded){
							if(type == 1){
								_self.startLuttery()
							}else if(type == 2){
								_self.helpLuttery()
							}
						}
					})
				}
				uni.showModal({
					title: '提示',
					content: '观看视频以继续' ,
					success: function (res) {
						if (res.confirm) {
							console.log('用户点击确定');
							_self.openVideo.show()
								.catch(() => {
									_self.openVideo.load()
										.then(() => {
											_self.openVideo.show()
										})
										.catch(err => {
											console.log('激励视频 广告显示失败')
											_self.active = false
											uni.showToast({
												title: '暂无激励视频',
												icon: 'none',
												duration: 2000
											});
										})
								})
							// ^视频显示
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			helpLuttery(){
				let _self = this
				uni.request({
					url: util.getUrl("prizedraw/seeAdv"),
					header: {
						'content-type': 'application/x-www-form-urlencoded',
						'Authori-zation':uni.getStorageSync("token")
					},
					data:{
						prizedraw_id:_self.luttery_id,
					},
					method: 'POST',
					success: res => {
						if(res.data.code == 1){
							uni.showToast({
								title:'助力成功！',
								icon:'success'
							})
							_self.getLutteryInfo()
						}else{
							if(res.data.code == 500){
								uni.navigateTo({
									url:'../../../pages/login/login'
								})
							}
						}
					},
				});
			},
			againInput(){
				this.$refs.keyFileStartPopup.close()
				this.$refs.keyStartPopup.open()
			},
			closeStartKey(){
				this.$refs.keyStartPopup.close()
				this.start_key = ""
			},
			inputStartKey(e){
				this.start_key = e.detail.value
			},
			goToJoinUser(){
				uni.navigateTo({
					url:'joinUser'
				})
			},
			notiecOpen(){
				let _self = this
				var thatlist = [_self.luttery_config.wx_prizedraw_open_msg_key];
				console.log(thatlist)
				wx.requestSubscribeMessage({
					tmplIds:thatlist,
					success(res){
						console.log(res)
						if(res[thatlist] === 'accept'){
							uni.showToast({
								title:'订阅成功',
								icon:'success'
							})
						}else if(res[thatlist] === 'reject'){
							uni.showToast({
								title:'订阅失败',
								icon:'none'
							})
						}
					},
					fail:(err)=>{
						console.log(err)
					}
				})	
				this.$refs.openNoticePopup.close()
			},
		}
	}
</script>

<style lang="scss">
	.loadmore-bottom{
		display: flex;
		width: 750upx;
		background: #FFFFFF;
		box-sizing: border-box;
		justify-content: center;
		image{
			width: 27upx;
			height: 29upx;
			margin-right: 20upx;
		}
	}
	.flex-center{
		display: flex;
		align-items: center;
		flex-direction: column;
		width: 750upx;
		padding-top: 30upx;
		box-sizing: border-box;
	}
	.luttery-ing{
		width: 690upx;
		display: flex;
		align-items: center;
		flex-direction: column;
		position: relative;
		margin-top: 31upx;
		.bottom-share{
			width: 545upx;
			height: 140upx;
			display: flex;
			align-items: center;
			justify-content: center;
			z-index: 1;
			margin-top: 56upx;
			.bottom-share-btn{
				display: flex;
				align-items: center;
				justify-content: center;
				height: 60upx;
				border-radius: 20upx;
				border: 2upx solid #FFFFFF;
				background-color: rgba(0,0,0,0);
				padding: 0 30upx;
				margin: 0;
				&::after{
					border: none;
					background: none;
				}
			}
		}
		.start-luttery-ing{
			width: 630upx;
			height: 80upx;
			display: flex;
			align-items: center;
			justify-content: center;
			border-radius: 20upx;
			z-index: 1;
		}
		.text-enter-ing{
			margin-bottom: 29upx;
			margin-top: 76upx;
			z-index: 1;
		}
		.luttery-top-ing{
			margin-top: 84upx;
			width: 556upx;
			height: 104upx;
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 30upx;
			z-index: 1;
		}
		.ing-bg-img{
			width: 100%;
			height: 471upx;
			position: absolute;
			top: 0;
			left: 0;
			z-index: 0;
		}
	}
	.friend-task-index{
		display: flex;
		align-items: center;
		width: 750upx;
		z-index: 1;
		flex-direction: column;
		padding: 0 30upx 30upx 30upx;
		.task-list{
			display: flex;
			flex-direction: column;
			.task-item{
				display: flex;
				flex-direction: column;
				margin-bottom: 40upx;
				.text-name{
					margin-bottom: 20upx;
				}
				.text-info{
					margin-bottom: 29upx;
				}
				.item-btn{
					width: 689upx;
					height: 93upx;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 10upx;
					border: 2upx solid #E9564F;
					.lookad-icon{
						width: 35upx;
						height: 35upx;
						margin-right: 20upx;
					}
				}
			}
		}
		.share-list{
			width: 100%;
			display: flex;
			align-items: center;
			margin-top: 30upx;
			margin-bottom: 41upx;
			.item-btn-1{
				width: 330upx;
				height: 93upx;
				display: flex;
				align-items: center;
				justify-content: center;
				border-radius: 10upx;
				border: 2upx solid #E9564F;
				&::after{
					border: none;
					background: none;
				}
				.down-load{
					width: 25upx;
					height: 28upx;
					margin-right: 19upx;
				}
				.wx-icon-share{
					width: 42upx;
					height: 35upx;
					margin-right: 20upx;
				}
			}
			.left-btn{
				margin-right: 29upx;
			}
		}
		.task-top-center{
			display: flex;
			flex-direction: column;
			width: 100%;
			.text1{
				margin-bottom: 19upx;
			}
		}
		.top-tip{
			width: 750upx;
			border-radius: 20upx 20upx 0px 0px;
			display: flex;
			align-items: center;
			justify-content: center;
			height:94upx;
			margin-bottom: 30upx;
		}
	}
	.publicbottompopup{
		display: flex;
		width: 750upx;
		align-items: center;
		flex-direction: column;
		position: relative;
		border-radius: 20upx 20upx 0 0 ;
		.close-popup{
			width: 31upx;
			height: 31upx;
			top: 30upx;
			right: 30upx;
			z-index: 3;
			position: absolute;
		}
	}
	.luck-list-popup{
		display: flex;
		width: 100%;
		align-items: center;
		flex-direction: column;
		box-sizing: border-box;
		padding-top: 96upx;
		z-index: 1;
		padding: 96upx 28upx 28upx 28upx;
		.top-tip-title1{
			margin-bottom: 136upx;
		}
		.luck-list-item{
			width: 630upx;
			height: 80upx;
			margin-bottom: 30upx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 0 30upx;
			box-sizing: border-box;
			border-radius: 20upx;
		}
	}
	.help-rule-popup{
		display: flex;
		width: 100%;
		align-items: center;
		flex-direction: column;
		box-sizing: border-box;
		padding-top: 96upx;
		z-index: 1;
		padding: 96upx 34upx 52upx 34upx;
		.top-tip-title{
			margin-bottom: 145upx;
		}
	}
	.friend-text{
		margin-top: 30upx;
	}
	.continue-help{
		display: flex;
		align-items: center;
		margin-top: 40upx;
		.item-1{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 270upx;
			height: 80upx;
			border-radius: 20upx;
			font-size: 30upx;
			border: 2upx solid #AEAEAE;
		}
	}
	.start-luttery-index{
		width: 100%;
		z-index: 1;
		display: flex;
		align-items: center;
		flex-direction: column;
		margin-top: 50upx;
		z-index: 1;
		.input-key{
			width: 630upx;
			height: 80upx;
			text-align: center;
			border-radius: 20upx;
			margin-bottom: 38upx;
		}
		.file-key-image-css{
			width: 149upx;
			height: 266upx;
			margin-bottom: 61upx;
		}
		.get-opportunity-file{
			margin-bottom: 116upx;
		}
		.get-opportunity{
			display: flex;
			align-items: center;
			margin-bottom: 126upx;
			image{
				width: 16upx;
				height: 27upx;
				margin-left: 15upx;
			}
		}
		.start-top-text{
			margin-bottom: 30upx;
		}
		.notice-btn-list{
			display: flex;
			align-items: center;
			margin-bottom: 50upx;
			.btn-item-margin{
				margin-right: 30upx;
				font-weight: 300;
			}
			.btn-item1{
				width: 300upx;
				height: 80upx;
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
				border-radius: 20upx;
				z-index: 1;
				.btn-item1-css{
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					z-index: 0;
				}
				.btn-text{
					z-index: 1;
				}
			}
		}
	}
	.file-luttery{
		text-align: center;
		margin: 41upx 0 39upx 0;
		line-height: 48upx;
	}
	.notice-index{
		width: 100%;
		padding: 30upx;
		display: flex;
		align-items: center;
		flex-direction: column;
		z-index: 1;
		.success-notice-top{
			display: flex;
			align-items: center;
			font-size: 36upx;
			font-weight: bold;
			margin-bottom: 47upx;
			margin-top: 78upx;
			.success-icon{
				width: 40upx;
				height: 40upx;
				margin-right: 20upx;
			}
		}
		.notice-btn-list{
			display: flex;
			align-items: center;
			margin-top: 167upx;
			.btn-item-margin{
				margin-right: 30upx;
				padding: 0;
				font-weight: 300;
				&::after{
					background: none;
					border: none;
				}
			}
			.btn-item1{
				width: 300upx;
				height: 80upx;
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
				border-radius: 20upx;
				z-index: 1;
				.btn-item1-css{
					position: absolute;
					top: 0;
					left: 0;
					width: 100%;
					height: 100%;
					z-index: 0;
				}
				.btn-text{
					z-index: 1;
				}
			}
		}
		.notiec-text{
			line-height: 40upx;
		}
		.new-user-top-text{
			margin-top: 41upx;
		}
		.notice-image1{
			width: 616upx;
			height: 397upx;
			margin-top: 13upx;
			margin-bottom: 49upx;
		}
		.notice-image{
			width: 630upx;
			height: 387upx;
			margin-top: 39upx;
		}
	}
	.publicpopup{
		display: flex;
		align-items: center;
		flex-direction: column;
		width: 690upx;
		box-sizing: border-box;
		position: relative;
		border-radius: 18upx;
		background: #FFFFFF;
		.popuptopimge{
			width: 361upx;
			height: 208upx;
			position: absolute;
			top: -135upx;
			z-index: 1;
		}
		.bg-height{
			height: 554upx;
		}
		.close-btn{
			z-index: 3;
			right: 75upx !important;
			top: 37upx !important;
		}
		.closeAssistant{
			width: 31upx;
			height: 31upx;
			position: absolute;
			top: 24upx;
			right: 24upx;
			z-index: 3;
		}
		.public-btn{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 410upx;
			height: 80upx;
			position: relative;
			margin-bottom: 40upx;
			.medium-btn-css{
				position: absolute;
				top: 0;
				left: 0;
				z-index: 0;
				width: 100%;
				height: 100%;
			}
			.btn-text{
				z-index: 1;
			}
		}
	}
	.bottom-btn{
		display: flex;
		padding: 30upx 0 0 30upx;
		width: 750upx;
		justify-content: center;
		flex-wrap: wrap;
		box-sizing: border-box;
		border-radius: 20upx 20upx 0 0 ;
		.btn{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 330upx;
			height: 80upx;
			font-size: 34upx;
			border-radius: 10upx;
			margin-right: 29upx;
			margin-bottom: 31upx;
		}
	}
	.share-btn-index{
		width: 100%;
		display: flex;
		flex-direction: row-reverse;
		margin-bottom: 30upx;
		.share-btn{
			display: flex;
			align-items: center;
			width: 256upx;
			height: 70upx;
			justify-content: center;
			box-shadow: 0px 3upx 7upx 0px rgba(0, 0, 0, 0.1);
			border: 1upx solid #EBEBEB;
			border-radius: 35upx;
			margin-bottom: 37upx;
			margin: 0;
			padding: 0;
			&::after{
				background: none;
				border: none;
			}
			.share-icon{
				width: 34upx;
				height: 33upx;
				margin-right: 15upx;
			}
		}
	}
	
	.ad-image{
		width: 690upx;
		height: 190upx;
		margin-top: 30upx;
		margin-bottom: 38upx;
		image{
			width: 100%;
			height: 100%;
		}
	}
	.upmove-join-luttery{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 200upx;
		height: 80upx;
		position: fixed;
		top: 20%;
		z-index: 98;
		border-radius: 20upx;
		animation: upmove 0.7s infinite;
		image{
			width: 77upx;
			height: 73upx;
			position: absolute;
			bottom: 0;
			right: -42upx;
		}
	}
	@keyframes upmove{
		0%{
			margin-top: 0upx;
		}
		100%{
			margin-top: -60upx;
		}
	}
	.join-avatar-user{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 100%;
		.join-avatar{
			width: 60upx;
			height: 60upx;
			border-radius: 8upx;
			margin-right: 10upx;
		}
	}
	.join-number{
		display: flex;
		align-items: center;
		font-size: 30upx;
		margin-bottom: 29upx;
		margin-top: 40upx;
		.red-next-image{
			width: 16upx;
			height: 27upx;
			margin-left: 10upx;
		}
	}
	.start-luttery-click{
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
		margin-top: 40upx;
		height: 260upx;
		width: 100%;
		.look-video-top-tip{
			width: 351upx;
			height: 101upx;
			position: absolute;
			display: flex;
			align-items: center;
			justify-content: center;
			top: -92upx;
			.top-tip-text{
				margin-bottom: 22upx;
				z-index: 1;
			}
			image{
				width: 100%;
				height: 100%;
				position: absolute;
				z-index: 0;
				top: 0;
				left: 0;
			}
		}
		.start-line{
			width: 175upx;
			height: 2upx;
			position: absolute;
			left: 60upx;
		}
		.look-ad-video{
			height: 224upx;
			width: 224upx;
			display: flex;
			align-items: center;
			justify-content: center;
			position: absolute;
			border-radius: 50%;
			.text-time{
				position: absolute;
				bottom: 29upx;
			}
		}
		.start-btn{
			display: flex;
			align-items: center;
			justify-content: center;
			position: absolute;
			height: 260upx;
			width: 260upx;
			.start-tip{
				display: flex;
				align-items: center;
				position: absolute;
				bottom: 0;
				right: -211upx;
				z-index: 1;
				.left-image{
					width: 60upx;
					height: 63upx;
					margin-left: 4upx;
				}
				.tip-text{
					display: flex;
					align-items: center;
					width: 226upx;
					height: 91upx;
					position: relative;
					z-index: 1;
					.tip-text-text{
						z-index: 1;
						margin-left: 31upx;
					}
					.tip-text-bgimg{
						position: absolute;
						top: 0;
						left: 0;
						width: 100%;
						height: 100%;
						z-index: 0;
					}
				}
			}
		}
		
		.start-text{
			font-size: 48upx;
			font-weight: 800;
			z-index: 1;
		}
		.start-image-bg{
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			right: 0;
			z-index: 0;
		}
		
	}
	.luttery-start-info-rule{
		display: flex;
		flex-direction: column;
		width: 690upx;
		border-radius: 20upx;
		.rule-rich-text{
			margin: 30upx;
			line-height: 48upx;
		}
		.rule-top-tab{
			display: flex;
			align-items: center;
			justify-content: space-around;
			height: 93upx;
			.item-left{
				display: flex;
				justify-content: center;
				width: 200upx;
				text-align: center;
				font-size: 34upx;
				position: relative;
				.bottom-line{
					width: 74upx;
					height: 4upx;
					position: absolute;
					bottom: -28upx;
				}
			}
		}
	}
	.luttery-info-title{
		width: 690upx;
		padding: 27upx 30upx;
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin-top: 30upx;
		border-radius: 20upx;
		margin-bottom: 30upx;
		.title-item1{
			display: flex;
			align-items: center;
			justify-content: center;
			
			image {
				width: 34upx;
				height: 34upx;
				margin-right: 10upx;
			}
		}
		.title-item2{
			display: flex;
			align-items: center;
			justify-content: center;
			width: 131upx;
			height: 40upx;
			border-radius: 4upx;
			image {
				width: 28upx;
				height: 23upx;
				margin-right: 10upx;
			}
		}
	}
	.luttery-top-info{
		width: 690upx;
		box-sizing: border-box;
		padding: 0 0 30upx 0;
		border-radius: 20upx;
		.luttery-info-image{
			width: 690upx;
			height: 300upx;
			border-radius: 20upx 20upx 0 0 ;
			margin-bottom: 30upx;
		}
		.luttery-text{
			margin-left: 35upx;
			display: flex;
			flex-direction: column;
			.text1{
				font-size: 30upx;
				line-height: 40upx;
			}
			.text2{
				line-height: 40upx;
				margin-bottom: 29upx;
			}
			.text3{
				
			}
		}
	}
	.content{
		display: flex;
		flex-direction: column;
		width: 750upx;
		min-height: 100vh;
		box-sizing: border-box;
		position: relative;
		align-items: center;
		font-family: PingFang SC;
	}
</style>
